import React, { useState } from 'react'
import { Navigate } from 'react-router-dom';

export default function Home() {

  const [sum, setSum] = useState(1);

  const add = () => {
    setSum((sum) => {
      return sum + 1;
    })
  }

  return (
    <div>
      <h3>Home</h3>
      {
        // 设置 replace为true 将设置浏览器的跳转模式为 replace, 浏览器自带的历史记录(前进后退) 将不能退回原来的Home页面
        sum === 3 ? <Navigate to='/about' replace={true} /> : <h4>当前sum的值是: {sum}</h4>
      }
      <button onClick={add}>点我Sum+1</button>
    </div>
  )
}
